﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Beyond Study</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
   
    <link rel="stylesheet" type="text/css" href="css/screen.css" />
    <link rel="stylesheet" type="text/css" href="css/colorbox.css" />    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
	<script src="js/jquery.colorbox.js"></script>
    <script type="text/javascript">
        $(document).ready(function() {

            // Popups
            $('.popup').colorbox({ inline: true, width: '750px' });

            // Essay Form
            var $step1 = $('.upload-form #step-1');
            var $step2 = $('.upload-form #step-2');
            var $payment_cc = $('.upload-form #option_cc');
            var $payment_pp = $('.upload-form #option_paypal');
            var price = 0;

            $('.upload-form #FileUpload2').hide();
            $('.upload-form #CancelAttach1').hide();
            $('.upload-form #CancelAttach2').hide();
            $('.upload-form #Label').hide(); 
            $('.upload-form #step-1 .submit').click(function(e) {

            if ($('.upload-form #name').val() == '' || $('.upload-form #email').val() == '' || $('.upload-form #FileUpload1').val() == '' || ($('.upload-form #FileUpload2').val() == '' && $('.upload-form #Label').val() == 'true'))
                    alert("Please fill out all items in this form!");
                else {
                    e.preventDefault();
                    $step1.slideUp('slow', function() {
                        $step2.slideDown('slow');
                    });
                }

                if ($('.upload-form #FileUpload1').val() != '') {
                    price = 49.95;
                }
                if (($('.upload-form #FileUpload2').val() != '') && ($('.upload-form #Label').val() == 'true')) {
                    price = 99.90;
                }

                $('.upload-form #Price').val(price);
            });

            $('.upload-form #step-2 input[name=payment_type]').click(function() {
                if ($(this).val() == 1) {
                    $payment_cc.fadeOut('slow', function() {
                        $payment_pp.fadeIn();
                    });
                } else {
                    $payment_pp.fadeOut('slow', function() {
                        $payment_cc.fadeIn();
                    });
                }
            });

        });

        function ShowAttach2() {
            $('.upload-form #FileUpload2').show();
            $('.upload-form #CancelAttach2').show();
            $('.upload-form #AttachNew').hide();
            $('.upload-form #Label').val('true');
        }

        function HideAttach2() {
            $('.upload-form #FileUpload2').hide();
            $('.upload-form #CancelAttach2').hide();
            $('.upload-form #AttachNew').show();
            $('.upload-form #Label').val('false');
        }

    </script>     
</head>
<body id="home">    
    <div class="header-container">        
        <div class="header">
            <a href="Default.aspx" class="logo" title="Beyond Study"><img src="images/logo.png" alt="Noteslap" /></a>
            <div class="share-links">
                <p>Share with Friends!</p>
                <ul>
                    <li><a href="http://www.facebook.com/pages/Beyond-Study/245774915543029"><img src="images/icon-facebook.png" alt="" /></a></li>
                    <li><a href="https://twitter.com/beyondstudy"><img src="images/icon-twitter.png" alt="" /></a></li>
                    <li>
                        <!-- AddThis Button BEGIN -->
                        <a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&amp;pubid=xa-4e8e398d5e043d6f"><img src="images/icon-share.png" alt="" /></a>
                        <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4e8e398d5e043d6f"></script>
                        <!-- AddThis Button END -->
                    </li>
                </ul>
            </div>
            <div class="top-menu">
                <ul>
                    <li><a href="page.aspx">Why Us?</a></li>
                    <li><a href="page.aspx">Our Markers</a></li>
                    <li class="last"><a href="page.aspx">Need Individual Help?</a></li>
                </ul>
            </div>
        </div>
    </div>
    <div class="content-container">
        <div class="content">
            <div class="summary">
                <h1>Let our HSC markers give you feedback on your essays</h1>
                <p>Your one way ticket to 20/20 essays!</p>
            </div>
            <img src="images/badge-4995.png" alt="" class="badge" />
			<div class="how-works">
				<h2>How it works:</h2>
				<ul>
					<li class="point-1">Submit Essays</li>
					<li class="point-2">Get Feedback</li>
					<li class="point-3">Ask a Question</li>
				</ul>                
			</div>
            <div class="essay-list">
                <h2>See our before &amp; after essays!</h2>
                <ul>
                    <li class="first">
                        <a href="#popup-1" class="popup">
                            <span class="name">ICEMAN</span>
                            <span class="title">English Lit Essay 2011</span>
                        </a>
                    </li>
                    <li>
                        <a href="#popup-1" class="popup">
                            <span class="name">ICEMAN</span>
                            <span class="title">English Lit Essay 2011</span>
                        </a>
                    </li>
                    <li>
                        <a href="#popup-1" class="popup">
                            <span class="name">ICEMAN</span>
                            <span class="title">English Lit Essay 2011</span>
                        </a>
                    </li>
                </ul>
                <p>
                    Still not convinced?<br />
                    <span class="blue">Read our testimonials!</span>
                </p>
            </div>
            <div class="upload-form">                
                <div class="essay"></div>
                <h2>Upload<br />your Essays</h2>
                <form runat="server">
                    <div id="step-1">
                        <div class="row">
                            <label for="name">Name*</label>
                            <div class="input">
                                <ASP:TextBox runat="server" type="text" id="name" />
                            </div>
                        </div>
                        <div class="row">
                            <label for="email">Email*</label>
                            <div class="input">
                                <ASP:TextBox runat="server" type="text" id="email" />
                            </div>
                        </div>
                        <div class="row">
                            <label for="grade">Grade*</label>
                            <div class="select">
                                <asp:DropDownList runat="server" id="grade">
                                    <asp:ListItem>Year 12</asp:ListItem>
                                    <asp:ListItem>Year 11</asp:ListItem>
                                    <asp:ListItem>Year 10</asp:ListItem>
                                </asp:DropDownList>
                            </div>
                        </div>
                        <div class="row">
                            <label for="subject">Subject*</label>
                            <div class="select">
                                <asp:DropDownList runat="server" id="subject">
                                    <asp:ListItem>English</asp:ListItem>
                                    <asp:ListItem>ESL English</asp:ListItem>
                                    <asp:ListItem>Standard English</asp:ListItem>
                                    <asp:ListItem>Advanced English</asp:ListItem>
                                    <asp:ListItem>Extension English</asp:ListItem>
                                </asp:DropDownList>
                            </div>
                        </div>
                        <div class="row file">
                            <label for="essays">File(s)*</label>
                            <div class="input">
                                <asp:FileUpload ID="FileUpload1" width="180px" runat="server"/>
                                <input type="button" id="CancelAttach1" value="Cancel" /> 
                                <asp:FileUpload ID="FileUpload2" width="180px" runat="server" /> 
                                <input type="button" id="CancelAttach2" value="Cancel" onclick="HideAttach2()"/>    
                                <input type="button" id="AttachNew" value="Attach another essay" onclick="ShowAttach2()"/>    
                                                         
                            </div>
                        </div>
                        <ASP:TextBox ID="Label" Text="false" runat="server" />
                        
                        <a href="#" class="submit" title="Go to Step 2">Go to Step 2<span></span></a>
                    </div>
                    <div id="step-2">
                        <div class="row radios">
                            <input type="radio" name="payment_type" id="payment_type_cc" value="0" /> <label for="payment_type_cc">Credit Card</label>
                            <input type="radio" name="payment_type" id="payment_type_paypal" value="1" /> <label for="payment_type_paypal">Paypal</label>
                        </div>
                        <div id="option_cc">
                            <div class="row">
                                <label for="cc_name">Name*</label>
                                <div class="input">
                                    <ASP:TextBox runat="server" type="text" id="cc_name" />
                                </div>
                            </div>
                            <div class="row">
                                <label for="cc_number">Number*</label>
                                <div class="input">
                                    <ASP:TextBox runat="server" type="text" id="cc_number" />
                                </div>
                            </div>
                            <div class="row">
                                <label for="cc_name">Expiry*</label>
                                <div class="select-group">
                                    <div class="select">
                                        <asp:DropDownList runat="server" id="expiry_month">
                                            <asp:listItem>01</asp:listItem>
                                            <asp:listItem>02</asp:listItem>
                                            <asp:listItem>03</asp:listItem>
                                            <asp:listItem>04</asp:listItem>
                                            <asp:listItem>05</asp:listItem>
                                            <asp:listItem>06</asp:listItem>
                                            <asp:listItem>07</asp:listItem>
                                            <asp:listItem>08</asp:listItem>
                                            <asp:listItem>09</asp:listItem>
                                            <asp:listItem>10</asp:listItem>
                                            <asp:listItem>11</asp:listItem>
                                            <asp:listItem>12</asp:listItem>
                                        </asp:DropDownList>
                                    </div>
                                    <div class="select">
                                        <asp:DropDownList runat="server" id="expiry_year">
                                            <asp:listItem>2012</asp:listItem>
                                            <asp:listItem>2013</asp:listItem>
                                            <asp:listItem>2014</asp:listItem>
                                            <asp:listItem>2015</asp:listItem>
                                            <asp:listItem>2016</asp:listItem>
                                        </asp:DropDownList>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <label for="cc_ccv">CCV*</label>
                                <div class="input sml">
                                    <ASP:TextBox runat="server" type="text" id="cc_ccv" />
                                </div>
                            </div>
                            <div class="row">
                            
                            <ASP:TextBox runat="server" type="text" id="Price" readonly="true" />  
                            <!--<input type="submit" class="submit" value="Submit" title="Submit" />-->
                            <span><asp:Button runat="server" class="submit" Text="Submit" OnClick="Button1_Click"></asp:Button></span>
                            </div>
                        </div>
                        <div id="option_paypal">
                            <a href="#" title="Checkout with Paypal"><img src="images/btn_xpressCheckout.gif" alt="" /></a>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="testimonials">
            <h3>Have a read of what other students have to say!</h3>
            <ul>
                <li class="first">
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas rhoncus justo quis lacus lacinia varius vitae ut enim. Etiam ut orci eu mi vulputate malesuada.</p>
                    <p class="author">M.Smith 24 July 2011</p>
                </li>
                <li>
                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas rhoncus justo quis lacus lacinia varius vitae ut enim. Etiam ut orci eu mi vulputate malesuada.</p>
                    <p class="author">M.Smith 24 July 2011</p>
                </li>
            </ul>            
        </div>
        <div class="footer">
            <ul class="links">
                <li>Copyright &copy; 2012 Beyond Study</li>
                <li><a href="Page.aspx">Privacy</a> |</li>
                <li><a href="Page.aspx">Terms &amp; Conditions</a> | </li>
                <li><a href="Page.aspx">Sitemap</a> |</li>
                <li><a href="Page.aspx">Contact Us</a></li>
            </ul>
        </div>
    </div> 
    
    <!-- popup start -->
    <div style="display:none">
        <div id="popup-1" class="popup-content">
            <h1>Pop-up Title</h1>
		    <img alt="" src="Images/BeyondStudy.jpg" />
        </div>
    </div>
    <!-- popup end -->

</body>
</html>

